<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>第一个 Layui 页面</title>
    <!-- 第一：下载 Layui 框架，并拷贝到项目中 -->
    <!-- 第二：导入 Layui 提供的 CSS 样式 -->
    <link href="layui/css/layui.css" rel="stylesheet">

    <style>
        .aaa {
            color:pink !important;
        }
    </style>
</head>
<body>
    <!-- 第四：结构化页面 - 参考并拷贝官网，使用预设的样式 -->
    <button type="button"
            class="layui-btn layui-bg-orange layui-btn-radius">
        登录
    </button>

    <button type="button"
            class="layui-btn layui-bg-orange layui-btn-xs">
        注册
    </button>


    <button type="button" class="layui-btn aaa">
        按钮 <i class="layui-icon layui-icon-ios layui-font-12"></i>
    </button>



<!-- 第三：导入 Layui 提供的 js 脚本文件 -->
<script src="layui/layui.js"></script>
<script>
    // 第五：根据需要，使用 Layui 相关的插件 或 API
    layui.use(function(){
        // 获取 layui 提供弹出层组件
        var layer = layui.layer;

        // 调用 弹出层组件 的 API 方法
        layer.msg('Hello World', {icon: 6});
    });
</script>
</body>
</html>